<script type="text/javascript" src="${pageContext.request.contextPath}/static/ueditor/third-party/SyntaxHighlighter/shCore.js"></script>
<link rel="stylesheet" href="${pageContext.request.contextPath}/static/ueditor/third-party/SyntaxHighlighter/shCoreDefault.css">
<script type="text/javascript">
    SyntaxHighlighter.all();
</script>
<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn"%>
<script type="text/javascript">
	function loadimage(){
		document.getElementById("randImage").src="${pageContext.request.contextPath}/image.jsp?"+Math.random();
	}
	
	function submitData(){
		var nickName = $("#nickName").val();
		var content=$("#content").val();
		var email = $("#email").val();
		var imageCode=$("#imageCode").val();
		if(email ==null || email == ''){
			
		}else{
			if(!/^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+((\.[a-zA-Z0-9_-]{2,3}){1,2})$/.test(email)){
				confirm("您输入的email格式不正确！");
			}
		}
		if(nickName==null || nickName==''){
			confirm("请输入您的昵称！");
		}else if(content==null || content==''){
			confirm("请输入评论内容！");
		}else if(imageCode==null || imageCode==''){
			confirm("请填写验证码！");
		}else{
			$.post("${pageContext.request.contextPath}/comment/save.do",{'content':content,'nickName':nickName,'email':email,'imageCode':imageCode,'blog.id':'${blog.id}'},function(result){
				if(result.success){
					window.location.reload();
					confirm("评论已提交成功，审核通过后显示！");
				}else{
					confirm(result.errorInfo);
				}
			},"json");
		}
	}
	
	function showOtherComment(){
		$('.otherComment').show();
	}
	
	function showTag(){
		var url = location.pathname;
		if (url.indexOf("oldtimes/articles")>0) {
			$(".data_list_title").find("span").text("韶华往事");
	    }
		if(url.indexOf("lifethings/articles")>0){
	    	$(".data_list_title").find("span").text("琐事日记");
	    }
		
	}
	
	$(function () {
		showTag();
	})
</script>
<div class="data_list">
	<div class="data_list_title">
		<img src="${pageContext.request.contextPath}/static/images/blog_show_icon.png"/>
		<span>博客信息</span>
	</div>
	<div>
	   <div class="blog_title"><h3><strong>${blog.title }</strong></h3></div>
	   <div style="padding-left: 330px;padding-bottom: 20px;padding-top: 10px">
			<div class="bshare-custom"><a title="分享到微信" class="bshare-weixin"></a><a title="分享到新浪微博" class="bshare-sinaminiblog"></a><a title="分享到QQ好友" class="bshare-qqim"></a><a title="分享到QQ空间" class="bshare-qzone"></a><a title="更多平台" class="bshare-more bshare-more-icon more-style-addthis"></a><span class="BSHARE_COUNT bshare-share-count">0</span></div><script type="text/javascript" charset="utf-8" src="http://static.bshare.cn/b/buttonLite.js#style=-1&amp;uuid=&amp;pophcol=3&amp;lang=zh"></script><script type="text/javascript" charset="utf-8" src="http://static.bshare.cn/b/bshareC0.js"></script>
	   </div>
		<div class="blog_info">
			编辑: ${blog.author }&nbsp;&nbsp;发布时间:『<fmt:formatDate value="${blog.releaseDate }" type="date" pattern="yyyy-MM-dd HH:mm"/>』&nbsp;&nbsp;博客类别: <c:choose><c:when test="${empty blog.blogType.typeName}" >韶华追忆</c:when><c:otherwise>${blog.blogType.typeName}</c:otherwise></c:choose>&nbsp;&nbsp;阅读(${blog.clickHit})&nbsp;&nbsp;评论(${blog.replyHit})
		</div>
		<div class="blog_content">
			${blog.content }
		</div>
		<div class="blog_keyWord">
			<font><strong>关键字：</strong></font>
			<c:choose>
				<c:when test="${keyWords==null}">
					&nbsp;&nbsp;无
				</c:when>
				<c:otherwise>
					<c:forEach var="keyWord" items="${keyWords }">
						&nbsp;&nbsp;<a href="${pageContext.request.contextPath}/blog/q.html?q=${keyWord}" target="_blank">${keyWord }</a>&nbsp;&nbsp;
					</c:forEach>
				</c:otherwise>
			</c:choose>
		</div>
		
		<div class="admire">
			<img class="shang" alt="赏他" title="微信扫一扫打赏他" src="${pageContext.request.contextPath}/static/images/dashang.jpg" >
		</div>
		<div class="blog_lastAndNextPage">
			${pageCode }
		</div>
	</div>
</div>
<div class="data_list">
	<div class="data_list_title">
		<img src="${pageContext.request.contextPath}/static/images/comment_icon.png"/>
		评论信息    
		<c:if test="${commentList.size()>10}">
			<a href="javascript:showOtherComment()" style="float: right;padding-right: 40px;text-decoration: none;" >显示所有评论</a>
		</c:if>
	</div>
	<div class="commentDatas">
		<c:choose>
			<c:when test="${commentList.size()==0}">
				暂无评论
			</c:when>
			<c:otherwise>
				<c:forEach var="comment" items="${commentList }" varStatus="status">
						<c:choose>
							<c:when test="${status.index<10 }">
								<div class="comment">
									<p><font class="nickName">${status.index+1 }楼&nbsp;&nbsp;&nbsp;${comment.nickName }</font>&nbsp;&nbsp;&nbsp;<span class="datetime"><fmt:formatDate value="${comment.commentDate }" type="date" pattern="yyyy-MM-dd HH:mm"/></span></p>
									<span class="content" style="margin-right: 10px;">${comment.content }</span>
								</div>								
							</c:when>
							<c:otherwise>
								<div class="otherComment">
									<div class="comment">
										<p><font class="nickName">${status.index+1 }楼&nbsp;&nbsp;&nbsp;${comment.nickName }</font>&nbsp;&nbsp;&nbsp;<span class="datetime"><fmt:formatDate value="${comment.commentDate }" type="date" pattern="yyyy-MM-dd HH:mm"/></span></p>
										<span class="content" >${comment.content }</span>
									</div>		
								</div>						
							</c:otherwise>
						</c:choose>
				</c:forEach>
			</c:otherwise>
		</c:choose>
	</div>
</div>

<div class="data_list" >
	<div class="data_list_title">
		<img src="${pageContext.request.contextPath}/static/images/publish_comment_icon.png"/>
		发表评论
	</div>
	<div class="publish_comment">
			<div class="reviewer">
				如何称呼您：<input type="text" value="" name="nickName"  id="nickName" size="10" placeholder="名称必填..." />
				&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
				您的邮箱：<input type="text" value="" name="email"  id="email" size="10" placeholder="您的邮箱..."/>
				&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
				验证码：<input type="text" value="${imageCode }" name="imageCode"  id="imageCode" size="5" />&nbsp;<img onclick="javascript:loadimage();"  title="换一张试试" name="randImage" id="randImage" src="${pageContext.request.contextPath}/image.jsp" width="60" height="20" border="1" align="absmiddle"> 
			</div>
			
			<div class="comment_area">
				<textarea rows="3" id="content" name="content" placeholder="来说两句呗...（文明评论，拒绝低俗！）"></textarea>
			</div>
			<div class="publishButton">
				<button class="btn btn-primary" type="button" onclick="submitData()">发表评论</button>
			</div>
	</div>
</div>